<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!--定义 viewport 因为页面的加载顺序，所以要让浏览器知道我们设置了它-->
    <!--viewport 只在移动端识别-->
    <!--适配的方式 就是设置屏幕的宽度和viewport的宽度一致-->
    <!--width 定义viewport宽度 有一个特殊的值 device-width 当前设备的宽度 -->
    <!--initial-scale 默认缩放比例 initial-scale=1.0和pc端的显示比例一致-->
    <!--是否允许用户自行缩放 user-scalable 1,0 yes,on -->
    <!--maximum-scale: 最大缩放比，大于0的数字-->
    <!--minimum-scale: 最小缩放比，小于0的数字-->
    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=0">
    <title></title>
    <style>
        body,html{
            margin:0;
            padding:0;
        }
        div{
            width:980px;
            height:1000px;
            background: pink;
            margin:0 auto;
        }
    </style>
</head>
<body>
    <div>内容123456789123456789内容123456789123456789内容123456789123456789内容123456789123456789
        内容123456789123456789内容123456789123456789内容123456789123456789内容123456789123456789内容123456789123456789
        内容123456789123456789内容123456789123456789内容123456789123456789内容123456789123456789内容123456789123456789
        内容123456789123456789内容123456789123456789内容123456789123456789内容123456789123456789内容123456789123456789
        内容123456789123456789内容123456789123456789内容123456789123456789内容123456789123456789内容123456789123456789
        内容123456789123456789内容123456789123456789内容123456789123456789内容123456789123456789内容123456789123456789
    </div>

</body>
</html>